-
Notifications
You must be signed in to change notification settings - Fork 4.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
KeyboardShortcuts: Update delete shortcut to use shift + Backspace
#68164
KeyboardShortcuts: Update delete shortcut to use shift + Backspace
#68164
Conversation
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.
To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
Looks like some Playwright tests are failing, will be adding a commit to fix the failing test cases. |
primaryShift + Backspace
with primaryShift + Delete
as alias
Took the latest iteration for a spin. This feel very solid for me: delete-block.mp4I'd encourage others to give this a spin, to check compatibility across platforms, etc, but this PR feels more intuitive than trunk, for the moment. Thank you! |
On Windows, the shortcut looks like this: One thing I noticed is that depending on the cursor position, the process to merge blocks can be prioritized. Below are two scenarios:
1c8b39edda7969ed70609cccc5bdeb52.mp4Can these be reproduced on a Mac? If the backspace and del keys don't work consistently, we might want to consider the d key. |
Yes, @t-hamano, you are right about that. And it's the same for Mac. I believed it was intended and that
What are your thoughts on this? Do we proceed with implementing Mac OS: Does this sound good? |
I came up with a different solution: merging blocks using del or Backspace is done here, so when command/ctrl + shift + del/backspace is executed, aborts the process: diff --git a/packages/block-editor/src/components/rich-text/event-listeners/delete.js b/packages/block-editor/src/components/rich-text/event-listeners/delete.js
index ae3fd733bb..12512626d9 100644
--- a/packages/block-editor/src/components/rich-text/event-listeners/delete.js
+++ b/packages/block-editor/src/components/rich-text/event-listeners/delete.js
@@ -6,7 +6,7 @@ import { isCollapsed, isEmpty } from '@wordpress/rich-text';
export default ( props ) => ( element ) => {
function onKeyDown( event ) {
- const { keyCode } = event;
+ const { keyCode, ctrlKey, shiftKey } = event;
if ( event.defaultPrevented ) {
return;
@@ -30,6 +30,11 @@ export default ( props ) => ( element ) => {
return;
}
+ // Exclude command+shift+del/delete as they are shortcuts for deleting blocks.
+ if ( event.ctrlKey && event.shiftKey ) {
+ return;
+ }
+
if ( onMerge ) {
onMerge( ! isReverse );
} |
primaryShift + Backspace
with primaryShift + Delete
as aliasprimaryShift + Backspace
primaryShift + Backspace
shift + Backspace
Hi @t-hamano, thanks for suggesting this approach. I've incorporated it in the latest commit. Also, as per this comment, I've implemented I've updated the PR Title, Description, and Screencasts/ Screenshots used appropriately to reflect the same. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM! Everything seems to work correctly on Windows.
- At the beginning of the text:
- ✅ Press backspace key: The blocks are merged (RichText shortcut)
- ✅ Press shift+backspace key: The block is removed (Shortcut implemented in this PR)
- ✅ Press shift+del key: The block is moved to the clipboard (Chrome shortcut)
- At the end of the text:
- ✅ Press del key: The blocks are merged (RichText shortcut)
- ✅ Press shift+backspace key: The block is removed (Shortcut implemented in this PR)
- ✅ Press shift+del key: The block is moved to the clipboard (Chrome shortcut)
@talldan @jasmussen Just to be sure, could you check if everything works as expected on Mac as well?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Confirmed, this works well on a Mac. It seems more ergonomic, intuitive, predictable, and works well across laptop and extended keyboards. Nice work!
Thank you, @t-hamano and @jasmussen, for taking the time to test the PR ✨! |
Fixes: #68139
What, Why & How?
Previously, the shortcut to remove the
selected blocks
wasControl
Option
Z
on Mac, orControl
Alt
Z
on Windows.This PR introduces the usage of
shift
+Backspace
for performing the same.Testing Instructions
SHIFT
+Backspace
and observe the removal of the block.Screencast
Screen.Recording.2024-12-24.at.3.17.15.PM.mov
Screenshot